@accessible/visually-hidden

---

<VisuallyHidden>

npm i @accessible/visually-hidden

---

A React component for adding visually hidden styles to elements

Quick Start

Simply wrap a child element that accepts a style prop and this component will add visually hidden styles to it without overwriting styles already present on the child.

// VisuallyHidden is the component
// visuallyHidden is a style object
import {VisuallyHidden, visuallyHidden} from '@accessible/visually-hidden'

export default (props) => (
  <VisuallyHidden>
    <input type='checkbox' {...props} />
  </VisuallyHidden>
)
// <input type='checkbox' style='...'/>

LICENSE

MIT

Changelog

2.0.0 (2020-07-07)

⚠ BREAKING CHANGES

• The VisuallyHidden component is no longer a default export. It's a named one e.g. import {VisuallyHidden} from '@accessible/visually-hidden'.

• move default export to named export (ff36dad)